<template>
	<view class="zai-box">
		<image src="/static/register.png" mode='aspectFit' class="zai-logo"></image>
		<view class="zai-title">售后PRO</view>
		<view class="zai-form">
			<input class="zai-input"  v-model="wname"  placeholder="请输入昵称" />
			<input class="zai-input" maxlength="11"  v-model="wusername" username placeholder="请输入手机号"/>
			<input class="zai-input"  v-model="wpassword" password placeholder="请输入密码"/>
			<button class="zai-btn" @click="register()">立即注册</button>
			<view   class="zai-label"><text @click="toLogin()">已有账号，点此去登录.</text></view>
		</view>
	</view>
</template>

<script>
		import setting from '../../common/setting.js'
		export default {
			data() {
				return {
					
						id:'',
						wname:'',
						wusername: '',
					    wpassword: ''		

					// register:{
					// 	id:'',
					// 	name:'',
					// 	username: '',
					//     password: ''				   
					// }				
				}
			},
			methods: {
				register(){
					var re=/^[0-9]*$/
					if ((this.wusername.length != 11) || (!re.test(this.wusername))) {
						uni.showToast({
							icon: 'none',
							title: '请正确输入11位手机号'
						});
						return;
					}
					else if (this.wpassword.length < 6) {
						uni.showToast({
							icon: 'none',
							title: '密码最短为 6 个字符'
						});
						return;
					}
				
					else{
						uni.request({
							method: 'post',
							url: setting.url+'/beforelogin/register',
							data:{
								id:this.id,
								wname:this.wname,
								wusername:this.wusername,
								wpassword:this.wpassword,
							},
							success(res) {
								console.log(res.data)
								if(res.data.code==-1){
									uni.showToast({
										icon:'none',
										title:'此账号已被注册，请更换手机号'
									});
								}
								else{
									
									uni.showToast({
									icon:'none',
									title:'账号注册成功，已登录'
									})
									// uni.reLaunch({
									// 	url:'../index/index'
									// })
								}
								
							}
						
						})
					}
				},
				toLogin(){
					uni.reLaunch({
						url:'../login/login'
					})
				}
			}
		}
</script>

<style>
	.zai-box{
		padding: 0 100upx;
		position: relative;
	}
	.zai-logo{
		width: 100%;
		width: 100%;
		height: 310upx;
	}
	.zai-title{
		position: absolute;
		top: 0;
		line-height: 360upx;
		font-size: 68upx;
		color: #fff;
		text-align: center;
		width: 100%;
		margin-left: -100upx;
	}
	.zai-form{
		margin-top: 300upx;
	}
	.zai-input{
		background: #e2f5fc;
		margin-top: 30upx;
		border-radius: 100upx;
		padding: 20upx 40upx;
		font-size: 36upx;
	}
	.input-placeholder, .zai-input{
		color: #94afce;
	}
	.zai-label{
		padding: 60upx 0;
		text-align: center;
		font-size: 30upx;
		color: #a7b6d0;
	}
	.zai-btn{
		background: #ff65a3;
		color: #fff;
		border: 0;
		border-radius: 100upx;
		font-size: 36upx;
		margin-top: 60upx;
	}
	.zai-btn:after{
		border: 0;
	}
	/*按钮点击效果*/
	.zai-btn.button-hover{
		transform: translate(1upx, 1upx);
	}
</style>
